<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >
		<title>troops</title>
	</head>
<body>
	<div id="troopManagement">
		<h1>Troop Management</h1>
		<h2>Resources</h2>
		<div id="ResourcesManagement">
		</div>
		<h2>Troops</h2>
	</div>

	<script type="text/javascript">
	$("#ResourcesManagement").append($("<table>").attr({ border: "1"}));
	$("#ResourcesManagement table").append($("<tr>")).append($("<tr>"));
	$("#ResourcesManagement table tr:eq(0)").append($("<th>").append($("<img>").attr({alt : "wood", src : "Resources/Images/wood.png"})));
	$("#ResourcesManagement table tr:eq(0)").append($("<th>").append($("<img>").attr({alt : "gold", src : "Resources/Images/gold.png"})));
	$("#ResourcesManagement table tr:eq(0)").append($("<th>").append($("<img>").attr({alt : "metal", src : "Resources/Images/metal.png"})));
	$("#ResourcesManagement table tr:eq(0)").append($("<th>").append($("<img>").attr({alt : "stone", src : "Resources/Images/stone.png"})));
	$("#ResourcesManagement table tr:eq(1)").append($("<th>").text(user.resources.wood));
	$("#ResourcesManagement table tr:eq(1)").append($("<th>").text(user.resources.gold));
	$("#ResourcesManagement table tr:eq(1)").append($("<th>").text(user.resources.metal));
	$("#ResourcesManagement table tr:eq(1)").append($("<th>").text(user.resources.stone));
	for (var i = 0; i < user.troopList.length; i++)
	{
		$("#troopManagement").append($("<div>").addClass("unit"));
		$(".unit:eq("+i+")").append($("<div>").addClass("title").text(user.troopList[i].name));
		$(".unit:eq("+i+")").append($("<div>").addClass("stats").append($("<table>").attr({ border: "1"})));
		$(".unit:eq("+i+") table").append($("<tr>"));
			$(".unit:eq("+i+") table:eq(0) tr:eq(0)").append($("<th>").append($("<img>").attr({alt: "lifeImg", src: "Resources/Images/heart.png"})));
			$(".unit:eq("+i+") table:eq(0) tr:eq(0)").append($("<th>").text(user.troopList[i].stat.life));
		$(".unit:eq("+i+") table").append($("<tr>"));
			$(".unit:eq("+i+") table:eq(0) tr:eq(1)").append($("<th>").append($("<img>").attr({alt: "attackImg", src: "Resources/Images/sword.png"})));
			$(".unit:eq("+i+") table:eq(0) tr:eq(1)").append($("<th>").text(user.troopList[i].stat.attack));
		$(".unit:eq("+i+") table").append($("<tr>"));
			$(".unit:eq("+i+") table:eq(0) tr:eq(2)").append($("<th>").append($("<img>").attr({alt: "defenseImg", src: "Resources/Images/shield.png"})));
			$(".unit:eq("+i+") table:eq(0) tr:eq(2)").append($("<th>").text(user.troopList[i].stat.defense));
		$(".unit:eq("+i+") table").append($("<tr>"));
			$(".unit:eq("+i+") table:eq(0) tr:eq(3)").append($("<th>").append($("<img>").attr({alt: "speedImg", src: "Resources/Images/speed.png"})));
			$(".unit:eq("+i+") table:eq(0) tr:eq(3)").append($("<th>").text(user.troopList[i].stat.hability));
		$(".unit:eq("+i+") table").append($("<tr>"));
			$(".unit:eq("+i+") table:eq(0) tr:eq(4)").append($("<th>").append($("<img>").attr({alt: "habilityImg", src: "Resources/Images/hand.png"})));
			$(".unit:eq("+i+") table:eq(0) tr:eq(4)").append($("<th>").text(user.troopList[i].stat.speed));
		$(".unit:eq("+i+")").append($("<div>").addClass("unitImg").append($("<img>").attr({ alt: "unitImg", src: "Resources/Images/" + user.troopList[i].name + ".png"})));
		$(".unit:eq("+i+")").append($("<div>").addClass("stats").append($("<table>").attr({ border: "1"})));
		$(".unit:eq("+i+") table:eq(1)").append($("<tr>"));
			$(".unit:eq("+i+") table:eq(1) tr:eq(0)").append($("<th>").append($("<img>").attr({alt: "metalImg", src: "Resources/Images/metal.png"})));
			$(".unit:eq("+i+") table:eq(1) tr:eq(0)").append($("<th>").text(user.troopList[i].price.metal));
			$(".unit:eq("+i+") table:eq(1) tr:eq(0)").append($("<th>").append($("<img>").attr({alt: "goldImg", src: "Resources/Images/gold.png"})));
			$(".unit:eq("+i+") table:eq(1) tr:eq(0)").append($("<th>").text(user.troopList[i].price.gold));
		$(".unit:eq("+i+") table:eq(1)").append($("<tr>"));
			$(".unit:eq("+i+") table:eq(1) tr:eq(1)").append($("<th>").append($("<img>").attr({alt: "stoneImg", src: "Resources/Images/stone.png"})));
			$(".unit:eq("+i+") table:eq(1) tr:eq(1)").append($("<th>").text(user.troopList[i].price.stone));
			$(".unit:eq("+i+") table:eq(1) tr:eq(1)").append($("<th>").append($("<img>").attr({alt: "woodImg", src: "Resources/Images/wood.png"})));
			$(".unit:eq("+i+") table:eq(1) tr:eq(1)").append($("<th>").text(user.troopList[i].price.wood));
		$(".unit:eq("+i+") table:eq(1)").append($("<tr>"));
			$(".unit:eq("+i+") table:eq(1) tr:eq(2)").append($("<th>").append($("<img>").attr({alt: "timeImg", src: "Resources/Images/time.png"})));
			$(".unit:eq("+i+") table:eq(1) tr:eq(2)").append($("<th>").text(user.troopList[i].price.time));
			$(".unit:eq("+i+") table:eq(1) tr:eq(2)").append($("<th>").text("pt"));
			$(".unit:eq("+i+") table:eq(1) tr:eq(2)").append($("<th>").text(user.troopList[i].price.points));
		$(".unit:eq("+i+")").append($("<div>").addClass("quantity").text(user.troopList[i].quantity));
		$(".unit:eq("+i+")").append($("<div>").addClass("button").append($("<a>").attr({href: "#"}).append($("<div>").text("Sell")))
		.click(function(){
		for (var j = 0; j < user.troopList.length; j++)
		{
			
			if (user.troopList[j].name == $(this).parent().children("div").html())
			{
				if (user.troopList[j].quantity > 0)
				{
					$(this).prev().text(--user.troopList[j].quantity);
					user.resources.wood += user.troopList[j].price.wood;
					$("#ResourcesManagement table tr:eq(1) th:eq(0)").text(user.resources.wood);
					user.resources.gold += user.troopList[j].price.gold;
					$("#ResourcesManagement table tr:eq(1) th:eq(1)").text(user.resources.gold);
					user.resources.metal += user.troopList[j].price.metal;
					$("#ResourcesManagement table tr:eq(1) th:eq(2)").text(user.resources.metal);
					user.resources.stone += user.troopList[j].price.stone;
					$("#ResourcesManagement table tr:eq(1) th:eq(3)").text(user.resources.stone);
					//$.getJSON('http://localhost:8084/slots/'+user.troopList[j].name+'/sell?token='+user.id, function(data){});
				}
			}
		}
		}));
		$(".unit:eq("+i+")").append($("<div>").addClass("button").append($("<a>").attr({href: "#"}).append($("<div>").text("Buy")))
		.click(function(){
		for (var j = 0; j < user.troopList.length; j++)
		{
			if (user.troopList[j].name == $(this).parent().children("div").html())
			{
				if (user.resources.wood >= user.troopList[j].price.wood && user.resources.gold >= user.troopList[j].price.gold && user.resources.metal >= user.troopList[j].price.metal && user.resources.stone >= user.troopList[j].price.stone)
				{
					$(this).prev().prev().text(++user.troopList[j].quantity);
					user.resources.wood -= user.troopList[j].price.wood;
					$("#ResourcesManagement table tr:eq(1) th:eq(0)").text(user.resources.wood);
					user.resources.gold -= user.troopList[j].price.gold;
					$("#ResourcesManagement table tr:eq(1) th:eq(1)").text(user.resources.gold);
					user.resources.metal -= user.troopList[j].price.metal;
					$("#ResourcesManagement table tr:eq(1) th:eq(2)").text(user.resources.metal);
					user.resources.stone -= user.troopList[j].price.stone;
					$("#ResourcesManagement table tr:eq(1) th:eq(3)").text(user.resources.stone);
					//$.getJSON('http://localhost:8084/slots/'+user.troopList[j].name+'/buy?token='+user.id, function(data){});
				}
			}
		}
		}));
	}
	</script>
</body>